<template>
       <div class="gold-shop-wrap">
        <van-nav-bar title="消费记录" left-arrow fixed @click-left="onClickLeft" />
       <div class="record_list">
        <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
            <div class="order_all" v-for="item,index in storeOrderList" :key="index">
                <div class="order_name_return">
                    <div class="order_name_left">{{ item.store_name }}</div>
                    <!-- <div class="order_name_right">等待付款</div> -->
                </div>
                <div class="order_lists">
                    <!-- <img src="../../assets/qr.jpg" alt=""> -->
                    <div class="order_goods">
                        <!-- <div class="order_goods_name">商品名称</div> -->
                        <div class="order_goods_sku">订单编号：{{ item.trade_no }}</div>
                        <div class="order_goods_sku">下单时间：{{ item.trade_success_time }}</div>
                        <div class="order_goods_sku">订单金额：{{ item.amount }}</div>
                        <div class="order_goods_sku">消费方式：{{ item.source_type==1?'线上买单':item.source_type==2?'线下扫码支付':'-' }}</div>
                        <!-- <div class="order_goods_price">退款：<span>￥100</span></div> -->
                    </div>
                </div>
                <!-- <div class="order_total">共计10件商品 总计：800</div> -->
                <!-- <div class="order_pay">
                    <div class="order_pay_money"></div>
                    <div class="">
                        <van-button class="order_pay_btn" type="primary" size="small">删除记录</van-button>
                        <van-button class="order_pay_btn" type="primary" size="small" @click="ordeInfo">查看详情</van-button>
                    </div>
                </div> -->
            </div>
        </van-list>
       </div>

    </div>
</template>
<script>
import { Dialog } from 'vant';
import {STORE_ORDER_LIST} from '@/api/mine'
export default{
    data() {
        return {
            loading:false,
            finished: false,
            storeOrderList:[],
            page:1,
            pageSize:20
        }
    },
    created() {
    window.scrollTo(0, 0)

        // this.active=this.$route.query.id
    },
    methods:{
        onClickLeft() {
            this.$router.back()
        },
        onLoad() {
                 let params = {};
				params['page_num'] = this.page;
				params['page_size'] = this.pageSize;
				params['store_id'] = this.$route.query.storeId;
                this.$http.get(STORE_ORDER_LIST, {params:params})
				.then(res => {
				  const {
				    list
				  } = res.data;
				  if(list && list.length) {
				     this.page++;
				     this.storeOrderList = this.storeOrderList.concat(list);

				     // 加载状态结束
				     this.loading = false;
				     if(list.length < this.pageSize) {
				      this.finished = true;
				     }
				  }else {
				    this.finished = true;
				  }
				})
    },
    // 详情
    ordeInfo(){
        this.$router.push({path:"/orderInfo",query:{
            id:1
        }})
    },
}
}
</script>
<style lang="scss" scoped>
.gold-shop-wrap {
    min-height: calc(100vh - 46px);
    padding-top: 46px;
    background: #f5f5f5;

    ::v-deep .van-nav-bar .van-icon {
        color: #333333;
    }

    ::v-deep .van-nav-bar__arrow {
        font-size: 20px;
    }
}
.record_list{
    padding-top: 0.32rem;
}
.order_all {
    width: 95%;
    margin: 0 auto;
    margin-bottom: 0.28rem;
    // border: 0.01rem solid #999;
    background-color: #fff;
    border-radius: 0.1rem;

    .order_name_return {
        display: flex;
        justify-content: space-between;
        font-size: 0.28rem;
        padding:0.28rem;
        padding-bottom:0 ;
        // border-bottom: 0.01rem solid #999;
        box-sizing: border-box;

        .order_name_left {
            font-weight: bold;
        }

        // &_right {
        //     font-size: 0.25rem;
        // }
    }

    .order_lists {
        padding: 0.28rem;
        padding-top: 0.2rem;
        // display: flex;
        // justify-content: space-between;

        // img {
        //     width: 1.8rem;
        // }

        .order_goods {
            width: 70%;
            font-size: 0.24rem;
            line-height: 0.5rem;
            color: #666666;
            &_name {
                font-size: 0.24rem;
            }

            &_sku {
                font-size: 0.24rem;
            }

            &_price {
                font-size: 0.3rem;
                // font-weight: bold;
                // display: flex;
                // justify-content: space-between;

                span:last-child {
                    font-weight: 500;
                    font-size: 0.25rem;
                    color: #999;
                }
            }
        }
    }

    // .order_total {
    //     margin-left: 2.3rem;
    //     font-size: 0.25rem;
    //     margin-bottom: 0.2rem;
    // }

    // .order_pay {
    //     border-top: 0.01rem solid #999;
    //     display: flex;
    //     justify-content: space-between;
    //     padding: 0.2rem;

    //     .order_pay_money {
    //         font-size: 0.25rem;
    //         margin-top: 0.2rem;
    //     }

    //     .order_pay_btn {
    //         margin-left: 0.2rem;
    //     }
    // }
}
</style>
